initArtCateList();

// 获取文章分类的列表
function initArtCateList() {
  $.ajax({
    method: "GET",
    url: "/my/article/cates",
    success: function (res) {
      let str = template("tpl", res);
      $("tbody").html(str);
    },
  });
}
let index;
let index1;
$("#addBtn").click(function () {
  index = layui.layer.open({
    type: 1,
    area: ["500px", "250px"],
    title: "添加文章分类",
    content: `
    <form class="layui-form" id="form-add">
    <div class="layui-form-item">
      <label class="layui-form-label">分类名称</label>
      <div class="layui-input-block">
        <input type="text" name="name" required  lay-verify="required" placeholder="请输入分类名称" autocomplete="off" class="layui-input">
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label">分类别名</label>
      <div class="layui-input-block">
        <input type="text" name="alias" required  lay-verify="required" placeholder="请输入分类别名" autocomplete="off" class="layui-input">
      </div>
    </div>
    <div class="layui-form-item">
      <div class="layui-input-block">
        <button class="layui-btn" lay-submit lay-filter="formDemo">确认添加</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
      </div>
    </div>
  </form>
    `,
  });
});

$("body").on("submit", "#form-add", function (e) {
  e.preventDefault();
  $.ajax({
    method: "POST",
    url: "/my/article/addcates",
    data: $(this).serialize(),
    success: function (res) {
      if (res.status !== 0) {
        return layui.layer.msg("新增分类失败！");
      }
      initArtCateList(); //添加分类成功，说明数据变旧了，重新渲染一次
      layui.layer.msg("新增分类成功！");
      layui.layer.close(index);
    },
  });
});
$("body").on("click", ".btn-edit", function () {
  index1 = layui.layer.open({
    type: 1,
    area: ["500px", "250px"],
    title: "修改文章分类",
    content: `
            <form class="layui-form" id="form-edit" lay-filter="form-edit">
            <div class="layui-form-item">
            <input type="hidden" name="Id" />
              <label class="layui-form-label">分类名称</label>
              <div class="layui-input-block">
                <input type="text" name="name" required  lay-verify="required" placeholder="请输入分类名称" autocomplete="off" class="layui-input">
              </div>
            </div>
            <div class="layui-form-item">
              <label class="layui-form-label">分类别名</label>
              <div class="layui-input-block">
                <input type="text" name="alias" required  lay-verify="required" placeholder="请输入分类别名" autocomplete="off" class="layui-input">
              </div>
            </div>
            <div class="layui-form-item">
              <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">确认添加</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
              </div>
            </div>
          </form>
            `,
  });
  let id = $(this).parent().attr("data-id");
  $.ajax({
    type: "get",
    url: "/my/article/cates/" + id,
    success(res) {
      layui.form.val("form-edit", res.data);
    },
  });
});
$("body").on("submit", "#form-edit", function (e) {
  e.preventDefault();
  $.ajax({
    type: "POST",
    url: "/my/article/updatecate",
    data: $(this).serialize(),
    success(res) {
      layui.layer.msg(res.message);
      if (res.status) return;
      layui.layer.close(index1);
      initArtCateList();
    },
  });
});
$("body").on("click", ".btn-del", function () {
  let id = $(this).parent().attr("data-id");
  layui.layer.confirm("确定删除?", function () {
    $.ajax({
      type: "GET",
      url: "/my/article/deletecate/" + id,
      success(res) {
        layui.layer.msg(res.message);
        if (res.status) return;
        initArtCateList();
      },
    });
  });
});
